Event.observe(window, 'load', function(){
	ImageRotator.init();
});

var Scroll = {
	init: function() {
		if ($('galleryImages') && $('toleft') && $('toright')) {
			this.galleryLeft = $('toleft');
			this.galleryRight = $('toright');
			this.scroll = $('galleryImages').down('ul');
		}
	}
}

var ImageRotator = {
	imageLoaded: function(img) {
	    // During the onload event, IE correctly identifies any images
	    // that weren't downloaded as not complete. Others should too.
	    // Gecko-based browsers act like NS4 in that they report this
	    // incorrectly: they always return true.
	    if (!img.complete) {
	        return false;
	    }
	    // 
	    // // However, they do have two very useful properties: naturalWidth
	    // // and naturalHeight. These give the true size of the image. If
	    // // it failed to load, either of these should be zero.
	    if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) {
	        return false;
	    }

	    // No other way of checking: assume it's ok.
	    return false;
	},
	init: function() {
		$$("div.imageRotator").each(function(element) {

			if (element.childElements().length > 1) {
				element.currentImage = 1
				element.timeOut = null
				element.images = element.childElements()
				element.images.each(function(img){
					img.loaded = false
					img.checkLoaded = $(new Image())
					img.checkLoaded.setStyle({'position': 'absolute', 'top': '0', 'left': '-10000px'})
					document.getElementsByTagName('body')[0].appendChild(img.checkLoaded)
					img.checkLoaded.src = img.src
					img.checkLoaded.observe('load', function(e){
						this.loaded = true
					}.bindAsEventListener(img))
				}.bind(this))
				if (element.up().down('img.goForward')) {
					element.up().down('img.goForward').observe("click", function(event){
						ImageRotator.showNext(element)
					}.bind(this))
				}
				if (element.up().down('img.goBackward')) {
					element.up().down('img.goBackward').observe("click", function(event) {
						ImageRotator.showPrevious(element)
					}.bind(this))
				}
				ImageRotator.startSlideshow(element)
			} else {
				element.up().down('.navigator').hide()
			}
			$$('.navigator img').each(function(obj){
				obj.observe('mouseover', function(event){this.src = this.src.replace('.gif', '-s.gif')})
				obj.observe('mouseout',  function(event){this.src = this.src.replace('-s.gif', '.gif')})
				var tmp = new Image(); tmp.src = obj.src.replace('.gif', '-s.gif');
			})
		}.bind(this))
	},
	startSlideshow: function(rotator) {
		rotator.timeOut = setTimeout(function() { ImageRotator.doShowNext(rotator, 1, 'slideshow') }, 3500)
	},
	showNext: function(obj) {
		ImageRotator.doShowNext(obj, 1)
	},
	showPrevious: function(obj) {
		ImageRotator.doShowNext(obj, -1)
	},

	doShowNext: function(rotator, offset, slideshow) {
		newCurrentImage = (rotator.currentImage + offset + rotator.images.length) % rotator.images.length
		if (true || this.imageLoaded(rotator.images[newCurrentImage].checkLoaded) || rotator.images[newCurrentImage].loaded) {
			rotator.images.each(function(obj){
				(obj != rotator.images[newCurrentImage]) ? ImageRotator.hide(obj) : ImageRotator.show(obj)
			})
			rotator.currentImage = newCurrentImage
			if (rotator.timeOut) clearTimeout(rotator.timeOut);
			if (slideshow) ImageRotator.startSlideshow(rotator)
		}
	},

	hide: function(object) {
		if (object.fadeEffect) object.fadeEffect.cancel()
		object.fadeEffect = Effect.Fade(object, { duration: 0.8 })
	},

	show: function(object) {
		if (object.fadeEffect) object.fadeEffect.cancel()
		object.fadeEffect = Effect.Appear(object, { duration: 0.8 })
	}
}

var Logger = {
	add: function(str) {
		$('logger').insert({top: str+'<br />'})
	}	
}
